<template>
    <div class="icon-body">
        <el-input v-model="name" style="position: relative;" clearable placeholder="请输入图标名称" @clear="filterIcons" @input.native="filterIcons">
            <i slot="suffix" class="el-icon-search el-input__icon"/>
        </el-input>
        <div class="icon-list">
            <div v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
                <span><i :class="item"/>{{ item }}</span>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'icon',
        data() {
            return {
                name: '23',
                icons: ['icon iconfont icon-check-circle', 'icon iconfont icon-CI', 'icon iconfont icon-Dollar', 'icon iconfont icon-compass', 'icon iconfont icon-close-circle', 'icon iconfont icon-frown', 'icon iconfont icon-info-circle', 'icon iconfont icon-left-circle', 'icon iconfont icon-down-circle', 'icon iconfont icon-EURO', 'icon iconfont icon-copyright', 'icon iconfont icon-minus-circle', 'icon iconfont icon-meh', 'icon iconfont icon-plus-circle', 'icon iconfont icon-play-circle', 'icon iconfont icon-question-circle', 'icon iconfont icon-Pound', 'icon iconfont icon-right-circle', 'icon iconfont icon-smile', 'icon iconfont icon-trademark', 'icon iconfont icon-time-circle', 'icon iconfont icon-timeout', 'icon iconfont icon-earth', 'icon iconfont icon-YUAN', 'icon iconfont icon-up-circle', 'icon iconfont icon-warning-circle', 'icon iconfont icon-sync', 'icon iconfont icon-transaction', 'icon iconfont icon-undo', 'icon iconfont icon-redo', 'icon iconfont icon-reload', 'icon iconfont icon-reloadtime', 'icon iconfont icon-message', 'icon iconfont icon-dashboard', 'icon iconfont icon-issuesclose', 'icon iconfont icon-poweroff', 'icon iconfont icon-logout', 'icon iconfont icon-piechart', 'icon iconfont icon-setting', 'icon iconfont icon-eye', 'icon iconfont icon-location', 'icon iconfont icon-edit-square', 'icon iconfont icon-export', 'icon iconfont icon-save', 'icon iconfont icon-Import', 'icon iconfont icon-appstore', 'icon iconfont icon-close-square', 'icon iconfont icon-down-square', 'icon iconfont icon-layout', 'icon iconfont icon-left-square', 'icon iconfont icon-play-square', 'icon iconfont icon-control', 'icon iconfont icon-codelibrary', 'icon iconfont icon-detail', 'icon iconfont icon-minus-square', 'icon iconfont icon-plus-square', 'icon iconfont icon-right-square', 'icon iconfont icon-project', 'icon iconfont icon-wallet', 'icon iconfont icon-up-square', 'icon iconfont icon-calculator', 'icon iconfont icon-interation', 'icon iconfont icon-check-square', 'icon iconfont icon-border', 'icon iconfont icon-border-outer', 'icon iconfont icon-border-top', 'icon iconfont icon-border-bottom', 'icon iconfont icon-border-left', 'icon iconfont icon-border-right', 'icon iconfont icon-border-inner', 'icon iconfont icon-border-verticle', 'icon iconfont icon-border-horizontal', 'icon iconfont icon-radius-bottomleft', 'icon iconfont icon-radius-bottomright', 'icon iconfont icon-radius-upleft', 'icon iconfont icon-radius-upright', 'icon iconfont icon-radius-setting', 'icon iconfont icon-adduser', 'icon iconfont icon-deleteteam', 'icon iconfont icon-deleteuser', 'icon iconfont icon-addteam', 'icon iconfont icon-user', 'icon iconfont icon-team', 'icon iconfont icon-areachart', 'icon iconfont icon-linechart', 'icon iconfont icon-barchart', 'icon iconfont icon-pointmap', 'icon iconfont icon-container', 'icon iconfont icon-database', 'icon iconfont icon-sever', 'icon iconfont icon-mobile', 'icon iconfont icon-tablet', 'icon iconfont icon-redenvelope', 'icon iconfont icon-book', 'icon iconfont icon-filedone', 'icon iconfont icon-reconciliation', 'icon iconfont icon-file-exception', 'icon iconfont icon-filesync', 'icon iconfont icon-filesearch', 'icon iconfont icon-solution', 'icon iconfont icon-fileprotect', 'icon iconfont icon-file-add', 'icon iconfont icon-file-excel', 'icon iconfont icon-file-exclamation', 'icon iconfont icon-file-pdf', 'icon iconfont icon-file-image', 'icon iconfont icon-file-markdown', 'icon iconfont icon-file-unknown', 'icon iconfont icon-file-ppt', 'icon iconfont icon-file-word', 'icon iconfont icon-file', 'icon iconfont icon-file-zip', 'icon iconfont icon-file-text', 'icon iconfont icon-file-copy', 'icon iconfont icon-snippets', 'icon iconfont icon-audit', 'icon iconfont icon-diff', 'icon iconfont icon-Batchfolding', 'icon iconfont icon-securityscan', 'icon iconfont icon-propertysafety', 'icon iconfont icon-safetycertificate', 'icon iconfont icon-insurance', 'icon iconfont icon-alert', 'icon iconfont icon-delete', 'icon iconfont icon-hourglass', 'icon iconfont icon-bulb', 'icon iconfont icon-experiment', 'icon iconfont icon-bell', 'icon iconfont icon-trophy', 'icon iconfont icon-rest', 'icon iconfont icon-USB', 'icon iconfont icon-skin', 'icon iconfont icon-home', 'icon iconfont icon-bank', 'icon iconfont icon-filter', 'icon iconfont icon-funnelplot', 'icon iconfont icon-like', 'icon iconfont icon-unlike', 'icon iconfont icon-unlock', 'icon iconfont icon-lock', 'icon iconfont icon-customerservice', 'icon iconfont icon-flag', 'icon iconfont icon-moneycollect', 'icon iconfont icon-medicinebox', 'icon iconfont icon-shop', 'icon iconfont icon-rocket', 'icon iconfont icon-shopping', 'icon iconfont icon-folder', 'icon iconfont icon-folder-open', 'icon iconfont icon-folder-add', 'icon iconfont icon-deploymentunit', 'icon iconfont icon-accountbook', 'icon iconfont icon-contacts', 'icon iconfont icon-carryout', 'icon iconfont icon-calendar-check', 'icon iconfont icon-calendar', 'icon iconfont icon-scan', 'icon iconfont icon-select', 'icon iconfont icon-boxplot', 'icon iconfont icon-build', 'icon iconfont icon-sliders', 'icon iconfont icon-laptop', 'icon iconfont icon-barcode', 'icon iconfont icon-camera', 'icon iconfont icon-cluster', 'icon iconfont icon-gateway', 'icon iconfont icon-car', 'icon iconfont icon-printer', 'icon iconfont icon-read', 'icon iconfont icon-cloud-server', 'icon iconfont icon-cloud-upload', 'icon iconfont icon-cloud', 'icon iconfont icon-cloud-download', 'icon iconfont icon-cloud-sync', 'icon iconfont icon-video', 'icon iconfont icon-notification', 'icon iconfont icon-sound', 'icon iconfont icon-radarchart', 'icon iconfont icon-qrcode', 'icon iconfont icon-fund', 'icon iconfont icon-image', 'icon iconfont icon-mail', 'icon iconfont icon-table', 'icon iconfont icon-idcard', 'icon iconfont icon-creditcard', 'icon iconfont icon-heart', 'icon iconfont icon-block', 'icon iconfont icon-error', 'icon iconfont icon-star', 'icon iconfont icon-gold', 'icon iconfont icon-heatmap', 'icon iconfont icon-wifi', 'icon iconfont icon-attachment', 'icon iconfont icon-edit', 'icon iconfont icon-key', 'icon iconfont icon-api', 'icon iconfont icon-disconnect', 'icon iconfont icon-highlight', 'icon iconfont icon-monitor', 'icon iconfont icon-link', 'icon iconfont icon-man', 'icon iconfont icon-percentage', 'icon iconfont icon-pushpin', 'icon iconfont icon-phone', 'icon iconfont icon-shake', 'icon iconfont icon-tag', 'icon iconfont icon-wrench', 'icon iconfont icon-tags', 'icon iconfont icon-scissor', 'icon iconfont icon-mr', 'icon iconfont icon-share', 'icon iconfont icon-branches', 'icon iconfont icon-fork', 'icon iconfont icon-shrink', 'icon iconfont icon-arrawsalt', 'icon iconfont icon-verticalright', 'icon iconfont icon-verticalleft', 'icon iconfont icon-right', 'icon iconfont icon-left', 'icon iconfont icon-up', 'icon iconfont icon-down', 'icon iconfont icon-fullscreen', 'icon iconfont icon-fullscreen-exit', 'icon iconfont icon-doubleleft', 'icon iconfont icon-doubleright', 'icon iconfont icon-arrowright', 'icon iconfont icon-arrowup', 'icon iconfont icon-arrowleft', 'icon iconfont icon-arrowdown', 'icon iconfont icon-upload', 'icon iconfont icon-colum-height', 'icon iconfont icon-vertical-align-botto', 'icon iconfont icon-vertical-align-middl', 'icon iconfont icon-totop', 'icon iconfont icon-vertical-align-top', 'icon iconfont icon-download', 'icon iconfont icon-sort-descending', 'icon iconfont icon-sort-ascending', 'icon iconfont icon-fall', 'icon iconfont icon-swap', 'icon iconfont icon-stock', 'icon iconfont icon-rise', 'icon iconfont icon-indent', 'icon iconfont icon-outdent', 'icon iconfont icon-menu', 'icon iconfont icon-unorderedlist', 'icon iconfont icon-orderedlist', 'icon iconfont icon-align-right', 'icon iconfont icon-align-center', 'icon iconfont icon-align-left', 'icon iconfont icon-pic-center', 'icon iconfont icon-pic-right', 'icon iconfont icon-pic-left', 'icon iconfont icon-bold', 'icon iconfont icon-font-colors', 'icon iconfont icon-exclaimination', 'icon iconfont icon-font-size', 'icon iconfont icon-infomation', 'icon iconfont icon-line-height', 'icon iconfont icon-strikethrough', 'icon iconfont icon-underline', 'icon iconfont icon-number', 'icon iconfont icon-italic', 'icon iconfont icon-code', 'icon iconfont icon-column-width', 'icon iconfont icon-check', 'icon iconfont icon-ellipsis', 'icon iconfont icon-dash', 'icon iconfont icon-close', 'icon iconfont icon-enter', 'icon iconfont icon-line', 'icon iconfont icon-minus', 'icon iconfont icon-question', 'icon iconfont icon-rollback', 'icon iconfont icon-small-dash', 'icon iconfont icon-pause', 'icon iconfont icon-bg-colors', 'icon iconfont icon-crown', 'icon iconfont icon-drag', 'icon iconfont icon-desktop', 'icon iconfont icon-gift', 'icon iconfont icon-stop', 'icon iconfont icon-fire', 'icon iconfont icon-thunderbolt', 'icon iconfont icon-check-circle-fill', 'icon iconfont icon-left-circle-fill', 'icon iconfont icon-down-circle-fill', 'icon iconfont icon-minus-circle-fill', 'icon iconfont icon-close-circle-fill', 'icon iconfont icon-info-circle-fill', 'icon iconfont icon-up-circle-fill', 'icon iconfont icon-right-circle-fill', 'icon iconfont icon-plus-circle-fill', 'icon iconfont icon-question-circle-fill', 'icon iconfont icon-EURO-circle-fill', 'icon iconfont icon-frown-fill', 'icon iconfont icon-copyright-circle-fil', 'icon iconfont icon-CI-circle-fill', 'icon iconfont icon-compass-fill', 'icon iconfont icon-Dollar-circle-fill', 'icon iconfont icon-poweroff-circle-fill', 'icon iconfont icon-meh-fill', 'icon iconfont icon-play-circle-fill', 'icon iconfont icon-Pound-circle-fill', 'icon iconfont icon-smile-fill', 'icon iconfont icon-stop-fill', 'icon iconfont icon-warning-circle-fill', 'icon iconfont icon-time-circle-fill', 'icon iconfont icon-trademark-circle-fil', 'icon iconfont icon-YUAN-circle-fill', 'icon iconfont icon-heart-fill', 'icon iconfont icon-piechart-circle-fil', 'icon iconfont icon-dashboard-fill', 'icon iconfont icon-message-fill', 'icon iconfont icon-check-square-fill', 'icon iconfont icon-down-square-fill', 'icon iconfont icon-minus-square-fill', 'icon iconfont icon-close-square-fill', 'icon iconfont icon-codelibrary-fill', 'icon iconfont icon-left-square-fill', 'icon iconfont icon-play-square-fill', 'icon iconfont icon-up-square-fill', 'icon iconfont icon-right-square-fill', 'icon iconfont icon-plus-square-fill', 'icon iconfont icon-accountbook-fill', 'icon iconfont icon-carryout-fill', 'icon iconfont icon-calendar-fill', 'icon iconfont icon-calculator-fill', 'icon iconfont icon-interation-fill', 'icon iconfont icon-project-fill', 'icon iconfont icon-detail-fill', 'icon iconfont icon-save-fill', 'icon iconfont icon-wallet-fill', 'icon iconfont icon-control-fill', 'icon iconfont icon-layout-fill', 'icon iconfont icon-appstore-fill', 'icon iconfont icon-mobile-fill', 'icon iconfont icon-tablet-fill', 'icon iconfont icon-book-fill', 'icon iconfont icon-redenvelope-fill', 'icon iconfont icon-safetycertificate-f', 'icon iconfont icon-propertysafety-fill', 'icon iconfont icon-insurance-fill', 'icon iconfont icon-securityscan-fill', 'icon iconfont icon-file-exclamation-fil', 'icon iconfont icon-file-add-fill', 'icon iconfont icon-file-fill', 'icon iconfont icon-file-excel-fill', 'icon iconfont icon-file-markdown-fill', 'icon iconfont icon-file-text-fill', 'icon iconfont icon-file-ppt-fill', 'icon iconfont icon-file-unknown-fill', 'icon iconfont icon-file-word-fill', 'icon iconfont icon-file-zip-fill', 'icon iconfont icon-file-pdf-fill', 'icon iconfont icon-file-image-fill', 'icon iconfont icon-diff-fill', 'icon iconfont icon-file-copy-fill', 'icon iconfont icon-snippets-fill', 'icon iconfont icon-batchfolding-fill', 'icon iconfont icon-reconciliation-fill', 'icon iconfont icon-folder-add-fill', 'icon iconfont icon-folder-fill', 'icon iconfont icon-folder-open-fill', 'icon iconfont icon-database-fill', 'icon iconfont icon-container-fill', 'icon iconfont icon-sever-fill', 'icon iconfont icon-calendar-check-fill', 'icon iconfont icon-image-fill', 'icon iconfont icon-idcard-fill', 'icon iconfont icon-creditcard-fill', 'icon iconfont icon-fund-fill', 'icon iconfont icon-read-fill', 'icon iconfont icon-contacts-fill', 'icon iconfont icon-delete-fill', 'icon iconfont icon-notification-fill', 'icon iconfont icon-flag-fill', 'icon iconfont icon-moneycollect-fill', 'icon iconfont icon-medicinebox-fill', 'icon iconfont icon-rest-fill', 'icon iconfont icon-shopping-fill', 'icon iconfont icon-skin-fill', 'icon iconfont icon-video-fill', 'icon iconfont icon-sound-fill', 'icon iconfont icon-bulb-fill', 'icon iconfont icon-bell-fill', 'icon iconfont icon-filter-fill', 'icon iconfont icon-fire-fill', 'icon iconfont icon-funnelplot-fill', 'icon iconfont icon-gift-fill', 'icon iconfont icon-hourglass-fill', 'icon iconfont icon-home-fill', 'icon iconfont icon-trophy-fill', 'icon iconfont icon-location-fill', 'icon iconfont icon-cloud-fill', 'icon iconfont icon-customerservice-fill', 'icon iconfont icon-experiment-fill', 'icon iconfont icon-eye-fill', 'icon iconfont icon-like-fill', 'icon iconfont icon-lock-fill', 'icon iconfont icon-unlike-fill', 'icon iconfont icon-star-fill', 'icon iconfont icon-unlock-fill', 'icon iconfont icon-alert-fill', 'icon iconfont icon-api-fill', 'icon iconfont icon-highlight-fill', 'icon iconfont icon-phone-fill', 'icon iconfont icon-edit-fill', 'icon iconfont icon-pushpin-fill', 'icon iconfont icon-rocket-fill', 'icon iconfont icon-thunderbolt-fill', 'icon iconfont icon-tag-fill', 'icon iconfont icon-wrench-fill', 'icon iconfont icon-tags-fill', 'icon iconfont icon-bank-fill', 'icon iconfont icon-camera-fill', 'icon iconfont icon-error-fill', 'icon iconfont icon-crown-fill', 'icon iconfont icon-mail-fill', 'icon iconfont icon-car-fill', 'icon iconfont icon-printer-fill', 'icon iconfont icon-shop-fill', 'icon iconfont icon-setting-fill', 'icon iconfont icon-USB-fill', 'icon iconfont icon-golden-fill', 'icon iconfont icon-build-fill', 'icon iconfont icon-boxplot-fill', 'icon iconfont icon-sliders-fill', 'icon iconfont icon-alibaba', 'icon iconfont icon-alibabacloud', 'icon iconfont icon-antdesign', 'icon iconfont icon-ant-cloud', 'icon iconfont icon-behance', 'icon iconfont icon-googleplus', 'icon iconfont icon-medium', 'icon iconfont icon-google', 'icon iconfont icon-IE', 'icon iconfont icon-amazon', 'icon iconfont icon-slack', 'icon iconfont icon-alipay', 'icon iconfont icon-taobao', 'icon iconfont icon-zhihu', 'icon iconfont icon-HTML', 'icon iconfont icon-linkedin', 'icon iconfont icon-yahoo', 'icon iconfont icon-facebook', 'icon iconfont icon-skype', 'icon iconfont icon-CodeSandbox', 'icon iconfont icon-chrome', 'icon iconfont icon-codepen', 'icon iconfont icon-aliwangwang', 'icon iconfont icon-apple', 'icon iconfont icon-android', 'icon iconfont icon-sketch', 'icon iconfont icon-Gitlab', 'icon iconfont icon-dribbble', 'icon iconfont icon-instagram', 'icon iconfont icon-reddit', 'icon iconfont icon-windows', 'icon iconfont icon-yuque', 'icon iconfont icon-Youtube', 'icon iconfont icon-Gitlab-fill', 'icon iconfont icon-dropbox', 'icon iconfont icon-dingtalk', 'icon iconfont icon-android-fill', 'icon iconfont icon-apple-fill', 'icon iconfont icon-HTML-fill', 'icon iconfont icon-windows-fill', 'icon iconfont icon-QQ', 'icon iconfont icon-twitter', 'icon iconfont icon-skype-fill', 'icon iconfont icon-weibo', 'icon iconfont icon-yuque-fill', 'icon iconfont icon-Youtube-fill', 'icon iconfont icon-yahoo-fill', 'icon iconfont icon-wechat-fill', 'icon iconfont icon-chrome-fill', 'icon iconfont icon-alipay-circle-fill', 'icon iconfont icon-aliwangwang-fill', 'icon iconfont icon-behance-circle-fill', 'icon iconfont icon-amazon-circle-fill', 'icon iconfont icon-codepen-circle-fill', 'icon iconfont icon-CodeSandbox-circle-f', 'icon iconfont icon-dropbox-circle-fill', 'icon iconfont icon-github-fill', 'icon iconfont icon-dribbble-circle-fill', 'icon iconfont icon-googleplus-circle-f', 'icon iconfont icon-medium-circle-fill', 'icon iconfont icon-QQ-circle-fill', 'icon iconfont icon-IE-circle-fill', 'icon iconfont icon-google-circle-fill', 'icon iconfont icon-dingtalk-circle-fill', 'icon iconfont icon-sketch-circle-fill', 'icon iconfont icon-slack-circle-fill', 'icon iconfont icon-twitter-circle-fill', 'icon iconfont icon-taobao-circle-fill', 'icon iconfont icon-weibo-circle-fill', 'icon iconfont icon-zhihu-circle-fill', 'icon iconfont icon-reddit-circle-fill', 'icon iconfont icon-alipay-square-fill', 'icon iconfont icon-dingtalk-square-fill', 'icon iconfont icon-CodeSandbox-square-f', 'icon iconfont icon-behance-square-fill', 'icon iconfont icon-amazon-square-fill', 'icon iconfont icon-codepen-square-fill', 'icon iconfont icon-dribbble-square-fill', 'icon iconfont icon-dropbox-square-fill', 'icon iconfont icon-facebook-fill', 'icon iconfont icon-googleplus-square-f', 'icon iconfont icon-google-square-fill', 'icon iconfont icon-instagram-fill', 'icon iconfont icon-IE-square-fill', 'icon iconfont icon-medium-square-fill', 'icon iconfont icon-linkedin-fill', 'icon iconfont icon-QQ-square-fill', 'icon iconfont icon-reddit-square-fill', 'icon iconfont icon-twitter-square-fill', 'icon iconfont icon-sketch-square-fill', 'icon iconfont icon-slack-square-fill', 'icon iconfont icon-taobao-square-fill', 'icon iconfont icon-weibo-square-fill', 'icon iconfont icon-zhihu-square-fill', 'icon iconfont icon-zoomout', 'icon iconfont icon-apartment', 'icon iconfont icon-audio', 'icon iconfont icon-audio-fill', 'icon iconfont icon-robot', 'icon iconfont icon-zoomin', 'icon iconfont icon-robot-fill', 'icon iconfont icon-bug-fill', 'icon iconfont icon-bug', 'icon iconfont icon-audiostatic', 'icon iconfont icon-comment', 'icon iconfont icon-signal-fill', 'icon iconfont icon-verified', 'icon iconfont icon-shortcut-fill', 'icon iconfont icon-videocameraadd', 'icon iconfont icon-switchuser', 'icon iconfont icon-whatsapp', 'icon iconfont icon-appstoreadd', 'icon iconfont icon-caret-down', 'icon iconfont icon-backward', 'icon iconfont icon-caret-up', 'icon iconfont icon-caret-right', 'icon iconfont icon-caret-left', 'icon iconfont icon-fast-backward', 'icon iconfont icon-forward', 'icon iconfont icon-fast-forward', 'icon iconfont icon-search', 'icon iconfont icon-retweet', 'icon iconfont icon-login', 'icon iconfont icon-step-backward', 'icon iconfont icon-step-forward', 'icon iconfont icon-swap-right', 'icon iconfont icon-swap-left', 'icon iconfont icon-woman', 'icon iconfont icon-plus', 'icon iconfont icon-eyeclose-fill', 'icon iconfont icon-eye-close', 'icon iconfont icon-clear', 'icon iconfont icon-collapse', 'icon iconfont icon-expand', 'icon iconfont icon-deletecolumn', 'icon iconfont icon-merge-cells', 'icon iconfont icon-subnode', 'icon iconfont icon-rotate-left', 'icon iconfont icon-rotate-right', 'icon iconfont icon-insertrowbelow', 'icon iconfont icon-insertrowabove', 'icon iconfont icon-table1', 'icon iconfont icon-solit-cells', 'icon iconfont icon-formatpainter', 'icon iconfont icon-insertrowright', 'icon iconfont icon-formatpainter-fill', 'icon iconfont icon-insertrowleft', 'icon iconfont icon-translate', 'icon iconfont icon-deleterow', 'icon iconfont icon-sisternode', 'icon iconfont icon-Field-number', 'icon iconfont icon-Field-String', 'icon iconfont icon-Function', 'icon iconfont icon-Field-time', 'icon iconfont icon-GIF', 'icon iconfont icon-Partition', 'icon iconfont icon-index', 'icon iconfont icon-Storedprocedure', 'icon iconfont icon-Field-Binary', 'icon iconfont icon-Console-SQL', 'icon iconfont icon-icon-test', 'icon iconfont icon-aim', 'icon iconfont icon-compress', 'icon iconfont icon-expend', 'icon iconfont icon-folder-view', 'icon iconfont icon-file-GIF', 'icon iconfont icon-group', 'icon iconfont icon-send', 'icon iconfont icon-Report', 'icon iconfont icon-View', 'icon iconfont icon-shortcut', 'icon iconfont icon-ungroup'],
                iconList: ['icon iconfont icon-check-circle', 'icon iconfont icon-CI', 'icon iconfont icon-Dollar', 'icon iconfont icon-compass', 'icon iconfont icon-close-circle', 'icon iconfont icon-frown', 'icon iconfont icon-info-circle', 'icon iconfont icon-left-circle', 'icon iconfont icon-down-circle', 'icon iconfont icon-EURO', 'icon iconfont icon-copyright', 'icon iconfont icon-minus-circle', 'icon iconfont icon-meh', 'icon iconfont icon-plus-circle', 'icon iconfont icon-play-circle', 'icon iconfont icon-question-circle', 'icon iconfont icon-Pound', 'icon iconfont icon-right-circle', 'icon iconfont icon-smile', 'icon iconfont icon-trademark', 'icon iconfont icon-time-circle', 'icon iconfont icon-timeout', 'icon iconfont icon-earth', 'icon iconfont icon-YUAN', 'icon iconfont icon-up-circle', 'icon iconfont icon-warning-circle', 'icon iconfont icon-sync', 'icon iconfont icon-transaction', 'icon iconfont icon-undo', 'icon iconfont icon-redo', 'icon iconfont icon-reload', 'icon iconfont icon-reloadtime', 'icon iconfont icon-message', 'icon iconfont icon-dashboard', 'icon iconfont icon-issuesclose', 'icon iconfont icon-poweroff', 'icon iconfont icon-logout', 'icon iconfont icon-piechart', 'icon iconfont icon-setting', 'icon iconfont icon-eye', 'icon iconfont icon-location', 'icon iconfont icon-edit-square', 'icon iconfont icon-export', 'icon iconfont icon-save', 'icon iconfont icon-Import', 'icon iconfont icon-appstore', 'icon iconfont icon-close-square', 'icon iconfont icon-down-square', 'icon iconfont icon-layout', 'icon iconfont icon-left-square', 'icon iconfont icon-play-square', 'icon iconfont icon-control', 'icon iconfont icon-codelibrary', 'icon iconfont icon-detail', 'icon iconfont icon-minus-square', 'icon iconfont icon-plus-square', 'icon iconfont icon-right-square', 'icon iconfont icon-project', 'icon iconfont icon-wallet', 'icon iconfont icon-up-square', 'icon iconfont icon-calculator', 'icon iconfont icon-interation', 'icon iconfont icon-check-square', 'icon iconfont icon-border', 'icon iconfont icon-border-outer', 'icon iconfont icon-border-top', 'icon iconfont icon-border-bottom', 'icon iconfont icon-border-left', 'icon iconfont icon-border-right', 'icon iconfont icon-border-inner', 'icon iconfont icon-border-verticle', 'icon iconfont icon-border-horizontal', 'icon iconfont icon-radius-bottomleft', 'icon iconfont icon-radius-bottomright', 'icon iconfont icon-radius-upleft', 'icon iconfont icon-radius-upright', 'icon iconfont icon-radius-setting', 'icon iconfont icon-adduser', 'icon iconfont icon-deleteteam', 'icon iconfont icon-deleteuser', 'icon iconfont icon-addteam', 'icon iconfont icon-user', 'icon iconfont icon-team', 'icon iconfont icon-areachart', 'icon iconfont icon-linechart', 'icon iconfont icon-barchart', 'icon iconfont icon-pointmap', 'icon iconfont icon-container', 'icon iconfont icon-database', 'icon iconfont icon-sever', 'icon iconfont icon-mobile', 'icon iconfont icon-tablet', 'icon iconfont icon-redenvelope', 'icon iconfont icon-book', 'icon iconfont icon-filedone', 'icon iconfont icon-reconciliation', 'icon iconfont icon-file-exception', 'icon iconfont icon-filesync', 'icon iconfont icon-filesearch', 'icon iconfont icon-solution', 'icon iconfont icon-fileprotect', 'icon iconfont icon-file-add', 'icon iconfont icon-file-excel', 'icon iconfont icon-file-exclamation', 'icon iconfont icon-file-pdf', 'icon iconfont icon-file-image', 'icon iconfont icon-file-markdown', 'icon iconfont icon-file-unknown', 'icon iconfont icon-file-ppt', 'icon iconfont icon-file-word', 'icon iconfont icon-file', 'icon iconfont icon-file-zip', 'icon iconfont icon-file-text', 'icon iconfont icon-file-copy', 'icon iconfont icon-snippets', 'icon iconfont icon-audit', 'icon iconfont icon-diff', 'icon iconfont icon-Batchfolding', 'icon iconfont icon-securityscan', 'icon iconfont icon-propertysafety', 'icon iconfont icon-safetycertificate', 'icon iconfont icon-insurance', 'icon iconfont icon-alert', 'icon iconfont icon-delete', 'icon iconfont icon-hourglass', 'icon iconfont icon-bulb', 'icon iconfont icon-experiment', 'icon iconfont icon-bell', 'icon iconfont icon-trophy', 'icon iconfont icon-rest', 'icon iconfont icon-USB', 'icon iconfont icon-skin', 'icon iconfont icon-home', 'icon iconfont icon-bank', 'icon iconfont icon-filter', 'icon iconfont icon-funnelplot', 'icon iconfont icon-like', 'icon iconfont icon-unlike', 'icon iconfont icon-unlock', 'icon iconfont icon-lock', 'icon iconfont icon-customerservice', 'icon iconfont icon-flag', 'icon iconfont icon-moneycollect', 'icon iconfont icon-medicinebox', 'icon iconfont icon-shop', 'icon iconfont icon-rocket', 'icon iconfont icon-shopping', 'icon iconfont icon-folder', 'icon iconfont icon-folder-open', 'icon iconfont icon-folder-add', 'icon iconfont icon-deploymentunit', 'icon iconfont icon-accountbook', 'icon iconfont icon-contacts', 'icon iconfont icon-carryout', 'icon iconfont icon-calendar-check', 'icon iconfont icon-calendar', 'icon iconfont icon-scan', 'icon iconfont icon-select', 'icon iconfont icon-boxplot', 'icon iconfont icon-build', 'icon iconfont icon-sliders', 'icon iconfont icon-laptop', 'icon iconfont icon-barcode', 'icon iconfont icon-camera', 'icon iconfont icon-cluster', 'icon iconfont icon-gateway', 'icon iconfont icon-car', 'icon iconfont icon-printer', 'icon iconfont icon-read', 'icon iconfont icon-cloud-server', 'icon iconfont icon-cloud-upload', 'icon iconfont icon-cloud', 'icon iconfont icon-cloud-download', 'icon iconfont icon-cloud-sync', 'icon iconfont icon-video', 'icon iconfont icon-notification', 'icon iconfont icon-sound', 'icon iconfont icon-radarchart', 'icon iconfont icon-qrcode', 'icon iconfont icon-fund', 'icon iconfont icon-image', 'icon iconfont icon-mail', 'icon iconfont icon-table', 'icon iconfont icon-idcard', 'icon iconfont icon-creditcard', 'icon iconfont icon-heart', 'icon iconfont icon-block', 'icon iconfont icon-error', 'icon iconfont icon-star', 'icon iconfont icon-gold', 'icon iconfont icon-heatmap', 'icon iconfont icon-wifi', 'icon iconfont icon-attachment', 'icon iconfont icon-edit', 'icon iconfont icon-key', 'icon iconfont icon-api', 'icon iconfont icon-disconnect', 'icon iconfont icon-highlight', 'icon iconfont icon-monitor', 'icon iconfont icon-link', 'icon iconfont icon-man', 'icon iconfont icon-percentage', 'icon iconfont icon-pushpin', 'icon iconfont icon-phone', 'icon iconfont icon-shake', 'icon iconfont icon-tag', 'icon iconfont icon-wrench', 'icon iconfont icon-tags', 'icon iconfont icon-scissor', 'icon iconfont icon-mr', 'icon iconfont icon-share', 'icon iconfont icon-branches', 'icon iconfont icon-fork', 'icon iconfont icon-shrink', 'icon iconfont icon-arrawsalt', 'icon iconfont icon-verticalright', 'icon iconfont icon-verticalleft', 'icon iconfont icon-right', 'icon iconfont icon-left', 'icon iconfont icon-up', 'icon iconfont icon-down', 'icon iconfont icon-fullscreen', 'icon iconfont icon-fullscreen-exit', 'icon iconfont icon-doubleleft', 'icon iconfont icon-doubleright', 'icon iconfont icon-arrowright', 'icon iconfont icon-arrowup', 'icon iconfont icon-arrowleft', 'icon iconfont icon-arrowdown', 'icon iconfont icon-upload', 'icon iconfont icon-colum-height', 'icon iconfont icon-vertical-align-botto', 'icon iconfont icon-vertical-align-middl', 'icon iconfont icon-totop', 'icon iconfont icon-vertical-align-top', 'icon iconfont icon-download', 'icon iconfont icon-sort-descending', 'icon iconfont icon-sort-ascending', 'icon iconfont icon-fall', 'icon iconfont icon-swap', 'icon iconfont icon-stock', 'icon iconfont icon-rise', 'icon iconfont icon-indent', 'icon iconfont icon-outdent', 'icon iconfont icon-menu', 'icon iconfont icon-unorderedlist', 'icon iconfont icon-orderedlist', 'icon iconfont icon-align-right', 'icon iconfont icon-align-center', 'icon iconfont icon-align-left', 'icon iconfont icon-pic-center', 'icon iconfont icon-pic-right', 'icon iconfont icon-pic-left', 'icon iconfont icon-bold', 'icon iconfont icon-font-colors', 'icon iconfont icon-exclaimination', 'icon iconfont icon-font-size', 'icon iconfont icon-infomation', 'icon iconfont icon-line-height', 'icon iconfont icon-strikethrough', 'icon iconfont icon-underline', 'icon iconfont icon-number', 'icon iconfont icon-italic', 'icon iconfont icon-code', 'icon iconfont icon-column-width', 'icon iconfont icon-check', 'icon iconfont icon-ellipsis', 'icon iconfont icon-dash', 'icon iconfont icon-close', 'icon iconfont icon-enter', 'icon iconfont icon-line', 'icon iconfont icon-minus', 'icon iconfont icon-question', 'icon iconfont icon-rollback', 'icon iconfont icon-small-dash', 'icon iconfont icon-pause', 'icon iconfont icon-bg-colors', 'icon iconfont icon-crown', 'icon iconfont icon-drag', 'icon iconfont icon-desktop', 'icon iconfont icon-gift', 'icon iconfont icon-stop', 'icon iconfont icon-fire', 'icon iconfont icon-thunderbolt', 'icon iconfont icon-check-circle-fill', 'icon iconfont icon-left-circle-fill', 'icon iconfont icon-down-circle-fill', 'icon iconfont icon-minus-circle-fill', 'icon iconfont icon-close-circle-fill', 'icon iconfont icon-info-circle-fill', 'icon iconfont icon-up-circle-fill', 'icon iconfont icon-right-circle-fill', 'icon iconfont icon-plus-circle-fill', 'icon iconfont icon-question-circle-fill', 'icon iconfont icon-EURO-circle-fill', 'icon iconfont icon-frown-fill', 'icon iconfont icon-copyright-circle-fil', 'icon iconfont icon-CI-circle-fill', 'icon iconfont icon-compass-fill', 'icon iconfont icon-Dollar-circle-fill', 'icon iconfont icon-poweroff-circle-fill', 'icon iconfont icon-meh-fill', 'icon iconfont icon-play-circle-fill', 'icon iconfont icon-Pound-circle-fill', 'icon iconfont icon-smile-fill', 'icon iconfont icon-stop-fill', 'icon iconfont icon-warning-circle-fill', 'icon iconfont icon-time-circle-fill', 'icon iconfont icon-trademark-circle-fil', 'icon iconfont icon-YUAN-circle-fill', 'icon iconfont icon-heart-fill', 'icon iconfont icon-piechart-circle-fil', 'icon iconfont icon-dashboard-fill', 'icon iconfont icon-message-fill', 'icon iconfont icon-check-square-fill', 'icon iconfont icon-down-square-fill', 'icon iconfont icon-minus-square-fill', 'icon iconfont icon-close-square-fill', 'icon iconfont icon-codelibrary-fill', 'icon iconfont icon-left-square-fill', 'icon iconfont icon-play-square-fill', 'icon iconfont icon-up-square-fill', 'icon iconfont icon-right-square-fill', 'icon iconfont icon-plus-square-fill', 'icon iconfont icon-accountbook-fill', 'icon iconfont icon-carryout-fill', 'icon iconfont icon-calendar-fill', 'icon iconfont icon-calculator-fill', 'icon iconfont icon-interation-fill', 'icon iconfont icon-project-fill', 'icon iconfont icon-detail-fill', 'icon iconfont icon-save-fill', 'icon iconfont icon-wallet-fill', 'icon iconfont icon-control-fill', 'icon iconfont icon-layout-fill', 'icon iconfont icon-appstore-fill', 'icon iconfont icon-mobile-fill', 'icon iconfont icon-tablet-fill', 'icon iconfont icon-book-fill', 'icon iconfont icon-redenvelope-fill', 'icon iconfont icon-safetycertificate-f', 'icon iconfont icon-propertysafety-fill', 'icon iconfont icon-insurance-fill', 'icon iconfont icon-securityscan-fill', 'icon iconfont icon-file-exclamation-fil', 'icon iconfont icon-file-add-fill', 'icon iconfont icon-file-fill', 'icon iconfont icon-file-excel-fill', 'icon iconfont icon-file-markdown-fill', 'icon iconfont icon-file-text-fill', 'icon iconfont icon-file-ppt-fill', 'icon iconfont icon-file-unknown-fill', 'icon iconfont icon-file-word-fill', 'icon iconfont icon-file-zip-fill', 'icon iconfont icon-file-pdf-fill', 'icon iconfont icon-file-image-fill', 'icon iconfont icon-diff-fill', 'icon iconfont icon-file-copy-fill', 'icon iconfont icon-snippets-fill', 'icon iconfont icon-batchfolding-fill', 'icon iconfont icon-reconciliation-fill', 'icon iconfont icon-folder-add-fill', 'icon iconfont icon-folder-fill', 'icon iconfont icon-folder-open-fill', 'icon iconfont icon-database-fill', 'icon iconfont icon-container-fill', 'icon iconfont icon-sever-fill', 'icon iconfont icon-calendar-check-fill', 'icon iconfont icon-image-fill', 'icon iconfont icon-idcard-fill', 'icon iconfont icon-creditcard-fill', 'icon iconfont icon-fund-fill', 'icon iconfont icon-read-fill', 'icon iconfont icon-contacts-fill', 'icon iconfont icon-delete-fill', 'icon iconfont icon-notification-fill', 'icon iconfont icon-flag-fill', 'icon iconfont icon-moneycollect-fill', 'icon iconfont icon-medicinebox-fill', 'icon iconfont icon-rest-fill', 'icon iconfont icon-shopping-fill', 'icon iconfont icon-skin-fill', 'icon iconfont icon-video-fill', 'icon iconfont icon-sound-fill', 'icon iconfont icon-bulb-fill', 'icon iconfont icon-bell-fill', 'icon iconfont icon-filter-fill', 'icon iconfont icon-fire-fill', 'icon iconfont icon-funnelplot-fill', 'icon iconfont icon-gift-fill', 'icon iconfont icon-hourglass-fill', 'icon iconfont icon-home-fill', 'icon iconfont icon-trophy-fill', 'icon iconfont icon-location-fill', 'icon iconfont icon-cloud-fill', 'icon iconfont icon-customerservice-fill', 'icon iconfont icon-experiment-fill', 'icon iconfont icon-eye-fill', 'icon iconfont icon-like-fill', 'icon iconfont icon-lock-fill', 'icon iconfont icon-unlike-fill', 'icon iconfont icon-star-fill', 'icon iconfont icon-unlock-fill', 'icon iconfont icon-alert-fill', 'icon iconfont icon-api-fill', 'icon iconfont icon-highlight-fill', 'icon iconfont icon-phone-fill', 'icon iconfont icon-edit-fill', 'icon iconfont icon-pushpin-fill', 'icon iconfont icon-rocket-fill', 'icon iconfont icon-thunderbolt-fill', 'icon iconfont icon-tag-fill', 'icon iconfont icon-wrench-fill', 'icon iconfont icon-tags-fill', 'icon iconfont icon-bank-fill', 'icon iconfont icon-camera-fill', 'icon iconfont icon-error-fill', 'icon iconfont icon-crown-fill', 'icon iconfont icon-mail-fill', 'icon iconfont icon-car-fill', 'icon iconfont icon-printer-fill', 'icon iconfont icon-shop-fill', 'icon iconfont icon-setting-fill', 'icon iconfont icon-USB-fill', 'icon iconfont icon-golden-fill', 'icon iconfont icon-build-fill', 'icon iconfont icon-boxplot-fill', 'icon iconfont icon-sliders-fill', 'icon iconfont icon-alibaba', 'icon iconfont icon-alibabacloud', 'icon iconfont icon-antdesign', 'icon iconfont icon-ant-cloud', 'icon iconfont icon-behance', 'icon iconfont icon-googleplus', 'icon iconfont icon-medium', 'icon iconfont icon-google', 'icon iconfont icon-IE', 'icon iconfont icon-amazon', 'icon iconfont icon-slack', 'icon iconfont icon-alipay', 'icon iconfont icon-taobao', 'icon iconfont icon-zhihu', 'icon iconfont icon-HTML', 'icon iconfont icon-linkedin', 'icon iconfont icon-yahoo', 'icon iconfont icon-facebook', 'icon iconfont icon-skype', 'icon iconfont icon-CodeSandbox', 'icon iconfont icon-chrome', 'icon iconfont icon-codepen', 'icon iconfont icon-aliwangwang', 'icon iconfont icon-apple', 'icon iconfont icon-android', 'icon iconfont icon-sketch', 'icon iconfont icon-Gitlab', 'icon iconfont icon-dribbble', 'icon iconfont icon-instagram', 'icon iconfont icon-reddit', 'icon iconfont icon-windows', 'icon iconfont icon-yuque', 'icon iconfont icon-Youtube', 'icon iconfont icon-Gitlab-fill', 'icon iconfont icon-dropbox', 'icon iconfont icon-dingtalk', 'icon iconfont icon-android-fill', 'icon iconfont icon-apple-fill', 'icon iconfont icon-HTML-fill', 'icon iconfont icon-windows-fill', 'icon iconfont icon-QQ', 'icon iconfont icon-twitter', 'icon iconfont icon-skype-fill', 'icon iconfont icon-weibo', 'icon iconfont icon-yuque-fill', 'icon iconfont icon-Youtube-fill', 'icon iconfont icon-yahoo-fill', 'icon iconfont icon-wechat-fill', 'icon iconfont icon-chrome-fill', 'icon iconfont icon-alipay-circle-fill', 'icon iconfont icon-aliwangwang-fill', 'icon iconfont icon-behance-circle-fill', 'icon iconfont icon-amazon-circle-fill', 'icon iconfont icon-codepen-circle-fill', 'icon iconfont icon-CodeSandbox-circle-f', 'icon iconfont icon-dropbox-circle-fill', 'icon iconfont icon-github-fill', 'icon iconfont icon-dribbble-circle-fill', 'icon iconfont icon-googleplus-circle-f', 'icon iconfont icon-medium-circle-fill', 'icon iconfont icon-QQ-circle-fill', 'icon iconfont icon-IE-circle-fill', 'icon iconfont icon-google-circle-fill', 'icon iconfont icon-dingtalk-circle-fill', 'icon iconfont icon-sketch-circle-fill', 'icon iconfont icon-slack-circle-fill', 'icon iconfont icon-twitter-circle-fill', 'icon iconfont icon-taobao-circle-fill', 'icon iconfont icon-weibo-circle-fill', 'icon iconfont icon-zhihu-circle-fill', 'icon iconfont icon-reddit-circle-fill', 'icon iconfont icon-alipay-square-fill', 'icon iconfont icon-dingtalk-square-fill', 'icon iconfont icon-CodeSandbox-square-f', 'icon iconfont icon-behance-square-fill', 'icon iconfont icon-amazon-square-fill', 'icon iconfont icon-codepen-square-fill', 'icon iconfont icon-dribbble-square-fill', 'icon iconfont icon-dropbox-square-fill', 'icon iconfont icon-facebook-fill', 'icon iconfont icon-googleplus-square-f', 'icon iconfont icon-google-square-fill', 'icon iconfont icon-instagram-fill', 'icon iconfont icon-IE-square-fill', 'icon iconfont icon-medium-square-fill', 'icon iconfont icon-linkedin-fill', 'icon iconfont icon-QQ-square-fill', 'icon iconfont icon-reddit-square-fill', 'icon iconfont icon-twitter-square-fill', 'icon iconfont icon-sketch-square-fill', 'icon iconfont icon-slack-square-fill', 'icon iconfont icon-taobao-square-fill', 'icon iconfont icon-weibo-square-fill', 'icon iconfont icon-zhihu-square-fill', 'icon iconfont icon-zoomout', 'icon iconfont icon-apartment', 'icon iconfont icon-audio', 'icon iconfont icon-audio-fill', 'icon iconfont icon-robot', 'icon iconfont icon-zoomin', 'icon iconfont icon-robot-fill', 'icon iconfont icon-bug-fill', 'icon iconfont icon-bug', 'icon iconfont icon-audiostatic', 'icon iconfont icon-comment', 'icon iconfont icon-signal-fill', 'icon iconfont icon-verified', 'icon iconfont icon-shortcut-fill', 'icon iconfont icon-videocameraadd', 'icon iconfont icon-switchuser', 'icon iconfont icon-whatsapp', 'icon iconfont icon-appstoreadd', 'icon iconfont icon-caret-down', 'icon iconfont icon-backward', 'icon iconfont icon-caret-up', 'icon iconfont icon-caret-right', 'icon iconfont icon-caret-left', 'icon iconfont icon-fast-backward', 'icon iconfont icon-forward', 'icon iconfont icon-fast-forward', 'icon iconfont icon-search', 'icon iconfont icon-retweet', 'icon iconfont icon-login', 'icon iconfont icon-step-backward', 'icon iconfont icon-step-forward', 'icon iconfont icon-swap-right', 'icon iconfont icon-swap-left', 'icon iconfont icon-woman', 'icon iconfont icon-plus', 'icon iconfont icon-eyeclose-fill', 'icon iconfont icon-eye-close', 'icon iconfont icon-clear', 'icon iconfont icon-collapse', 'icon iconfont icon-expand', 'icon iconfont icon-deletecolumn', 'icon iconfont icon-merge-cells', 'icon iconfont icon-subnode', 'icon iconfont icon-rotate-left', 'icon iconfont icon-rotate-right', 'icon iconfont icon-insertrowbelow', 'icon iconfont icon-insertrowabove', 'icon iconfont icon-table1', 'icon iconfont icon-solit-cells', 'icon iconfont icon-formatpainter', 'icon iconfont icon-insertrowright', 'icon iconfont icon-formatpainter-fill', 'icon iconfont icon-insertrowleft', 'icon iconfont icon-translate', 'icon iconfont icon-deleterow', 'icon iconfont icon-sisternode', 'icon iconfont icon-Field-number', 'icon iconfont icon-Field-String', 'icon iconfont icon-Function', 'icon iconfont icon-Field-time', 'icon iconfont icon-GIF', 'icon iconfont icon-Partition', 'icon iconfont icon-index', 'icon iconfont icon-Storedprocedure', 'icon iconfont icon-Field-Binary', 'icon iconfont icon-Console-SQL', 'icon iconfont icon-icon-test', 'icon iconfont icon-aim', 'icon iconfont icon-compress', 'icon iconfont icon-expend', 'icon iconfont icon-folder-view', 'icon iconfont icon-file-GIF', 'icon iconfont icon-group', 'icon iconfont icon-send', 'icon iconfont icon-Report', 'icon iconfont icon-View', 'icon iconfont icon-shortcut', 'icon iconfont icon-ungroup'],
            }
        },
        methods: {
            filterIcons() {
                if (this.name) {
                    this.iconList = this.iconList.filter(item => item.includes(this.name))
                } else {
                    this.iconList = this.icons
                }
            },
            selectedIcon(name) {
                this.$emit('selected', name)
                document.body.click()
            },
            reset() {
                this.name = ''
                this.iconList = this.icons
            }
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .icon-body {
        width: 100%;
        padding: 10px;

        .icon-list {
            height: 200px;
            overflow-y: scroll;

            div {
                height: 30px;
                line-height: 30px;
                margin-bottom: -5px;
                cursor: pointer;
                width: 33%;
                float: left;
            }

            span {
                display: inline-block;
                vertical-align: -0.15em;
                fill: currentColor;
                overflow: hidden;
            }
        }
    }
</style>
